<template>
    <div>
<h2>会员列表</h2>
手机号：  <input type="text" v-model="state.phone"  />
   用户名： <input type="text" v-model="state.mname"  />
   <input type="button" value="查询" @click="getlist" />
   <input type="button" value="导出" @click="execll" />
<table class="table table-bordered">
<tr>
    <th>用户名</th>
    <th>手机号</th>
    <th>积分</th>
    <th>余额</th>
    <th>操作</th>
</tr>
<tr v-for="item in list">
    <td>{{ item.mName }}</td>
    <td>{{ item.phone }}</td>
    <td> <img :src="item.mPhoto" alt="" width="70" height="70" /></td>
    <td>{{ item.jifen }}</td>
    <td>{{ item.money }}</td>
    <td>
        <input type="button" value="修改积分" @click="updJifen(item.mId)" />
        <input type="button" value="充值" @click="chongzhi(item.mId)" />
        <input type="button" value="详情" @click="xiangqi(item.mId)" />
    </td>
</tr>
</table>
    </div>
</template>

<script setup lang="ts">
import { onMounted, reactive, toRefs } from 'vue';
import axios from 'axios';
import { useRouter, useRoute } from 'vue-router';
const router = useRouter();
let data:any = reactive({
    state: {
        phone: "",
        mname: "",
    },
    list:[]
})
let { state, list } = toRefs(data)
onMounted(()=>{
    getlist()
})
const getlist=()=>{
    let obj = {
        phone: state.value.phone,
        mName: state.value.mname,
    }
    axios({
        url: '/api/Member/GetMembers',
        method: 'get',
        params: obj
    })
        .then(res => {
            console.log(res)
           list.value=res.data.data
        })
        .catch(err => {
            console.log(err)
        })
}
const execll=()=>{
    location.href="https://localhost:7096/api/Member/GetExecl"
}
const xiangqi=(id:any)=>{
    router.push({
        path:'/xiangqin',
        query:{
            id:id
        }
    })
}
const updJifen=(id:any)=>{
    router.push({
        path:'/updJifen',
        query:{
            id:id
        }
    })
}
const chongzhi=(id:any)=>{
    router.push({
        path:'/chongzhi',
        query:{
            id:id
        }
    })
}
</script>

<style scoped>

</style>